<template>
  <div class="VantLoading" v-show="loading" @touchmove.prevent.stop>
    <van-loading
      class="loading"
      size="30px"
      type="circular"
      vertical
      text-size="14px"
      color="#c9c9c9"
      >加载中...
    </van-loading>
  </div>
</template>

<script>
import { mapState } from "vuex";
export default {
  name: "VantLoading",
  computed: {
    ...mapState("app", ["loading"]),
  },
  data() {
    return {};
  },
};
</script>

<style lang="less" scoped>
.VantLoading {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 1;
  .loading {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}
</style>